<template>
  <div class="nav content">
    <div class="nav-item">
      <div class="wangji-job">
        <RouterLink to="/shezi"><span><</span></RouterLink>
        <div>意见反馈</div>
        <span class="dd"></span>
      </div>
    </div>
    <div class="nav-item">
      <div class="wangji-jobb">
        <span>类别</span>
        <div class="dd"></div>
        <div class="use">
            <div>功能使用</div>
            <div>其他建议</div>
        </div>
      </div>
    </div>
    <div class="wenzi">
        <span>分享本次购物体验，2～256字</span>
    </div>
    <div class="aa">
        <div class="photos">
            <div class="photos-job">
                <img src="../../assets/images/zhaoxiangji.png" alt="">
            </div>
            <span>添加图片</span>
        </div>
        <div class="photo">
            <div>最多添加3张</div>
        </div>
    </div>
    <div class="tuichu">
        <div>提交</div>
    </div>
  </div>
</template>
<style scoped>
.wangji-job {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  border-bottom: 1px solid #ccc;
}
.nav-item span{
    padding: 5px 0;
}

.use {
    display: flex;
}
.use div {
    margin: 0 10px;
    border: 1px solid #000;
    padding: 5px;
    border-radius: 15px;
}
.use div:nth-child(2) {
    border: 1px solid rgb(9, 182, 116);
    color: rgb(9, 182, 116);
}
.wangji-jobb {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  border-bottom: 15px solid #f1f1f1;
}
.wenzi {
    padding: 15px;
    color: #ccc;
}
.photos-job img{
    width: 50px;
    height: 50px;
}
.aa {
    display: flex;
    padding: 120px 20px;
    color: #ccc;
}
.photo{
    margin: 60px 20px;
}
.tuichu {
  width: 320px;
    margin-top: 30px;
    text-align: center;
    color: #fff;
    border: 1px solid rgb(9, 182, 116);
    background-color: rgb(9, 182, 116);
    padding: 10px;
    border-radius: 25px;
    margin-left: 10px;
}
</style>
